<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <#include "/include/head_common.ftl">
    <#include "/include/login_trace.ftl">
    <#include "/include/tree_view.ftl">
    <title>文件管理</title>
    <meta name="decorator" content="default"/>
    <style type="text/css">
        .ztree {
            overflow: auto;
            margin: 0;
            _margin-top: 10px;
            padding: 10px 0 0 10px;
            width: 40%
        }
        div#rMenu {
            filter:alpha(Opacity=80);
            position: absolute;
            visibility: hidden;
            top: 0;
            text-align: left;
            padding: 5px;
        }

        div#rMenu a {
            filter:alpha(Opacity=80);
            padding: 3px 10px 3px 10px;
            background-color: gainsboro;
            vertical-align: middle;
        }
    </style>
</head>
<body>
<div id="rMenu" style="display: none">
    <a id="download_file" href="javascript:void(0)" class="list-group-item" onclick="download_file">下载</a> <BR>
    <a id="delete_file" href="javascript:void(0)" class="list-group-item" onclick="delete_file();">删除</a> <BR>
    <a id="open_in_new" href="javascript:void(0)" class="list-group-item" onclick="open_in_new();">查看</a>
</div>
<div id="content" class="row-fluid">
    <div id="left" class="accordion-group">
        <div class="accordion-heading" style="text-align: center">
            <label>请选择文件源：&nbsp;&nbsp;&nbsp;</label>
            <select id="file_select" name="file" style="width: 200px" onchange="selectFileSource()">
                <option value="">你好</option>
                <option value="2">你好2</option>
                <option value="3">你好3</option>
                <option value="4">你好4</option>
                <option value="5">你好5</option>
            </select>
        </div>
        <div class="accordion-heading">
            <a class="accordion-toggle">文件目录<i class="icon-refresh pull-right" onclick="refreshTree()"></i></a>
        </div>
        <div id="ztree" class="ztree"></div>
    </div>
    <div id="openClose" class="close">&nbsp;</div>
    <div id="right">
        <iframe id="fileContent" src="" width="100%" height="91%" frameborder="0"></iframe>
    </div>
</div>
<script type="text/javascript">
    function selectFileSource(){
        var file_select  = $('#file_select').val();
        if(file_select.length > 0){
            window.location.href = "${rootUrl}/file/index?fileSource=" + encodeURI(file_select);
        }
    }
	//右键树结构
	function zTreeOnRightClick(event, treeId, treeNode) {
		// console.log(treeNode);
		$("#fileNode_pid").val(treeNode.id);
		$("#fileNode_pname").val(treeNode.damc);
		if (!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) {
			showRMenu("root", event.clientX, event.clientY);
		} else if (treeNode && !treeNode.noR) {
			showRMenu("node", event.clientX, event.clientY);
		}
		console.log(treeNode.id);
		$("#download_file").attr("onclick","download_file('"+encodeURI(treeNode.id)+"')");
		$("#open_in_new").attr("onclick","open_in_new('"+encodeURI(treeNode.id)+"')");
	};

	//显示右键菜单
	function showRMenu(type, x, y) {
		$("#rMenu").show();
		$("#rMenu").css({"top": y + "px", "left": x + "px", "visibility": "visible"}); //设置右键菜单的位置、可见
		$("body").bind("mousedown", onBodyMouseDown);
	}

	//隐藏右键菜单
	function hideRMenu() {
		$("#rMenu").css({"visibility": "hidden"}); //设置右键菜单不可见
		$("body").unbind("mousedown", onBodyMouseDown);
	}
	//鼠标按下事件
	function onBodyMouseDown(event) {
		if (!(event.target.id == "rMenu" || $(event.target).parents("#rMenu").length > 0)) {
			$("#rMenu").css({ "visibility": "hidden"});
		}
	}
	function download_file(nodeId) {
		var downloadWindow=window.open('_blank');
           downloadWindow.location='${rootUrl}/file/downloadFile?fileSource=${fileSource!''}&id=' + nodeId;
	}

	function open_in_new(nodeId){
	    var downloadWindow=window.open('_blank');
           downloadWindow.location='${rootUrl}/file/openFile?fileSource=${fileSource!''}&id=' + nodeId;
	}

	function delete_file(nodeId){
	    var downloadWindow=window.open('_blank');
           downloadWindow.location='${rootUrl}/file/deleteFile?fileSource=${fileSource!''}&id=' + nodeId;
	}
    var setting = {
        async: {
            enable: true,
            url:"${rootUrl}/file/treeData",
            autoParam:["id","fileSource"],
            type: 'get'
        },
        data: {simpleData: {enable: true, idKey: "id", pIdKey: "pId", rootPId: '${fileSource!''}'}},
        callback: {
            onClick: function (event, treeId, treeNode) {
                if(treeNode.isParent){
                    console.log(event);
                    console.log(treeId);
                    console.log(treeNode);
                    var zTree = $.fn.zTree.getZTreeObj(treeId);
                    zTree.reAsyncChildNodes(treeNode, "refresh");
                }else {
                    $("#fileContent").attr("src","${rootUrl}/file/fileDetail?fileSource=${fileSource!''}&id="+encodeURI(treeNode.id));
                }
            },
            onRightClick: zTreeOnRightClick
        }
    };

    function refreshTree() {
        $.getJSON("${rootUrl}/file/treeData?fileSource=${fileSource!''}", function (data) {
            $.fn.zTree.init($("#ztree"), setting, data).expandAll(true);
        });
    }
    refreshTree();
    var leftWidth = 500; // 左侧窗口大小
    var htmlObj = $("html"), mainObj = $("#main");
    var frameObj = $("#left, #openClose, #right, #right iframe");
    function wSize() {
        var strs = getWindowSize().toString().split(",");
        htmlObj.css({"overflow-x": "hidden", "overflow-y": "hidden"});
        mainObj.css("width", "auto");
        frameObj.height(strs[0] - 5);
        var leftWidth = ($("#left").width() < 0 ? 0 : $("#left").width());
        $("#right").width($("#content").width() - leftWidth - $("#openClose").width() - 5);
        $(".ztree").width(leftWidth - 10).height(frameObj.height() - 46);
    }
</script>
<script src="${rootUrl}/common/wsize.min.js" type="text/javascript"></script>
</body>
</html>